<template>
  <div class="header">
    <div class="header-inner">
      <span class="maoyan">猫眼电影</span>
      <div class="nav">

        <ul class="navbar">
          <li >南宁<span class="iconfont icon-jiantouarrow486"style="padding-left:5px "></span></li>

          <router-link to="/homepage">
            <li><a href="" >首页</a></li>
          </router-link>

          <router-link to="/movies">
            <li><a href="" >电影</a></li>
          </router-link>

          <router-link to="/cinema">
            <li><a href="" >影院</a></li>
          </router-link>

          <li><a href="">演出</a></li>

          <router-link to="/list">
            <li><a href="" >榜单</a></li>
          </router-link>

          <li><a href="" >热点</a></li>


          <router-link to="/shoppingmall">
            <li><a href="">商城</a></li>
          </router-link>

        </ul>
      </div>

    </div>

  </div>
</template>

<script>
  export default {
    name: "Header",
  }

</script>

<style >
  .header{

    top: 0;
    z-index: 999;
    width: 100%;
    min-width: 1200px;
    background-color: #fff;
    border-bottom: 1px solid #d8d8d8;

  }
/*  .header {
    position: fixed;
    top: 0;
    z-index: 999;
    width: 100%;
    min-width: 1200px;
    background-color: #fff;
    border-bottom: 1px solid #d8d8d8;
  }*/
  .header-inner{
    width: 1200px;
    margin: 0 auto;
    height: 80px;
  }
  .nav{
    display: inline-block;
    background-color: #fff;
    overflow: hidden;

  }
  .navbar{
    padding: 10px;
    margin: 15px;
    list-style: none;
    border: none;

  }
  .maoyan{
    margin-top:15px;font-size: 36px ;color: chocolate;
  }
  li{
    float: left;
    margin-left: 50px;
    font-size: 18px;
    color: black;
  }
  li a{
    text-decoration: none;
    color: #333333;
  }

    /*width: 62px*/


</style>
